<template>
	<swiper style="height: 750rpx;" :indicator-dots="false" :autoplay="true" :interval="3000" :duration="1000" :circular="true">
		<swiper-item v-for="(item,index) in rule_hc_result" :key="item.id">
			<view v-if="item.type == 'C'" class="img_container flex flex-dir-col flex-ai-center mb-16">
				<!-- <w-image :src="src" width="343" height="367" mode="widthFix" radius="12"></w-image> -->
				<view class="main-image-box">
					<image :src="$ossUrl + item.info.main_image"  class="w-100 h-100 br-16"></image>
					<view class="mb-cp">目标藏品</view>
				</view>
				<view class="mt-17 font-size-20 font-color-white">{{ item.info&&item.info.name }}</view>
				<view class="flex flex-ai-center flex-js-center mt-20">
					<w-tag size="yellow" name="发行" :value="item.info&&item.info.total_num + '份'"></w-tag>
					<w-tag class="ml-10" size="yellow" name="流通" :value="item.info&&item.info.flux + '份'"></w-tag>
					
				</view>
				<!-- <view class="rule_btn" @click="toRule">活动规则 <w-icon name="right" size="8"></w-icon> </view> -->
			</view>
			<view v-else class="img_container flex flex-dir-col flex-ai-center mb-16">
				<!-- <w-image :src="src" width="343" height="367" mode="widthFix" radius="12"></w-image> -->
				<view class="main-image-box">
					<image :src="$ossUrl+src"  class="w-100 h-100 br-16"></image>
					<view class="mb-cp">目标藏品</view>
				</view>
				<view class="mt-17 font-size-20 font-color-white">{{ title }}</view>
				<!-- <view class="rule_btn" @click="toRule">活动规则 <w-icon name="right" size="8"></w-icon> </view> -->
			</view>
		</swiper-item>
	</swiper>
</template>

<script>
	export default {
		props:{
			src:{
				type:String
			},
			title: {
				type: String,
				default:''
			},
			rule_hc_result:{
				type:Array,
				default: () => {
					return []
				}
			}
		},
		data() {
			return {
				
			};
		},
		methods:{
	
		}
	}
</script>

<style lang="scss" scoped>
	.img_container{
		width: 100%;
		position: relative;
		margin-top: 100rpx;
		.main-image-box {
			width: 402rpx;
			height: 400rpx;
			@include ossBg('/static/bg/hc-main-bg.png');
			background-size: 100% 100%;
			background-repeat: no-repeat;
			padding: 10rpx;
			position: relative;
			.mb-cp {
				position: absolute;
				top:0;
				left: calc((100% - 74rpx - 40rpx) / 2);
				width: 74px;
				height: 20px;
				background: #F87E28;
				border-radius: 0 0 34rpx 34rpx;
				font-size: 22rpx;
				color: #fff;
				text-align: center;
			}
		}
	}
</style>
